<template>
  <j-modal
    :title="title"
    :width="width"
    :visible="visible"
    :confirmLoading="confirmLoading"
    switchFullscreen
    @ok="handleOk"
    @cancel="handleCancel"
    cancelText="关闭">
    <a-spin :spinning="confirmLoading">
      <a-form-model ref="form" :model="model" :rules="validatorRules">
        <a-row>
          <a-col :span="24">
            <a-form-model-item label="工站" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="op">
              <a-select placeholder="请选择工站" v-model="model.op" @change="opChange">
                <a-select-option :value="undefined">请选择</a-select-option>
                <a-select-option v-for="(item, key) in options" :key="key" :value="item.op">
                  <span style="display: inline-block;width: 100%" :title=" item.op">
                    {{ item.description + '-' + item.op }}
                  </span>
                </a-select-option>
              </a-select>
<!--              <op-select placeholder="请选择工站" v-model="model.op" :line="model.line" @change="opChange"></op-select>-->
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="缺陷描述" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="cfgid">
              <a-select
                v-model="model.cfgid"
                show-search
                placeholder="缺陷描述"
                :options="cfgOptions"
                :filter-option="filterOption"
                @change="handleChange"
              ></a-select>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="处理方案" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="cc">
              <!--              <a-radio-group v-model:value="model.cc" option-type="button" :options="typOption" />-->
              <a-radio-group v-model="model.cc" button-style="solid" @change="typeChange">
                <a-radio-button value="1">返工</a-radio-button>
                <a-radio-button value="3">报废</a-radio-button>
                <a-radio-button value="4">冻结</a-radio-button>
                <a-radio-button value="8">转OK</a-radio-button>
                <a-radio-button value="7">仅记录</a-radio-button>
              </a-radio-group>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="返工代码" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="code">
              <a-select placeholder="请选择返工代码" v-model="model.code">
                <a-select-option :value="undefined">请选择</a-select-option>
                <a-select-option v-for="(item, key) in rwkOptions" :key="key" :value="item.code">
                  <span style="display: inline-block;width: 100%" :title="item.code">
                    {{ item.code }}
                  </span>
                </a-select-option>
              </a-select>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="是否返工件" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="checked">
              <a-switch v-model:checked="model.checked" @change="reworkButton" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="备注" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="code">
              <a-textarea v-model:value="model.remark" allow-clear @change="remarkChange(model.remark)"
                          style="width: 80%" />
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model>
    </a-spin>
  </j-modal>
</template>

<script>

import { getAction, httpAction } from '@api/manage'
import OpSelect from '@comp/mes/OpSelect.vue'
import Vue from 'vue'
import { USER_INFO } from '@/store/mutation-types'
import ShiftSelect from '@comp/mes/ShiftSelect.vue'
import { validateDuplicateValue } from '@/utils/util'

export default {
  name: 'QualityReworkModal',
  components: {
    ShiftSelect,
    OpSelect
  },
  props: {},
  data() {
    return {
      isEdit: false,
      title: '操作',
      width: 800,
      visible: false,
      codeModel: {},
      type: 0,
      unitsn: '',
      remark: '',
      typOption: [
        {
          label: '返工',
          value: '1'
        },
        {
          label: '报废',
          value: '3'
        },
        {
          label: '冻结',
          value: '4'
        },
        {
          label: '转OK',
          value: '8'
        },
        {
          label: '转NG',
          value: '9'
        }
      ],
      options:[],
      cfgOptions: [],
      cfgOptionDetails: [],
      rwkOptions: [],
      line: '',
      op:'',
      model: {
        line: '',
        op: '',
        cfgid: '',
        cc: '',
        code: '',
        remark: ''
      },
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 }
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 }
      },

      confirmLoading: false,
      validatorRules: {},
      runCmd: '/monitor/api/runCmd',
      url: {
        cfgList: '/qis/qisReinspectCfg/list',
        rwkList: '/qis/mesRwkCodeCfg/list',
        addValue: '/trace/qisReinspectValue/addValue',
        getOpSelect: '/basic/mesLineOpCfg/opSelect',
        add: '/basic/mesLabelCfg/add'
      }

    }
  },
  created() {
    //this.modelDefault = JSON.parse(JSON.stringify(this.model))
  },
  methods: {
    getOptions(val) {
      getAction(this.url.getOpSelect, { line: val }).then((res) => {
        if (res.success) {
          this.options = res.result
        }
        if (res.code === 510) {
          this.$message.warning(res.message)
        }
      })
    },
    reworkButton(val) {
      if (val) {
        let str = this.model.remark
        let subStr = '#返工件'
        if (str.includes(subStr)) {
        } else {
          this.model.remark = str + subStr
          this.remarkChange(this.model.remark)
        }
      }
    },
    remarkChange(val) {
      let unicode = ''
      for (let i = 0; i < val.length; i++) {
        const charCode = val[i].charCodeAt(0).toString(16) // 获取每个字符的 Unicode 编码值
        if (charCode.length >= 4) {
          unicode += '\\u' + charCode // 对于超过四位的 Unicode 编码值需要添加 \u 前缀
        } else {
          unicode += '\\u00' + charCode // 对于不足四位的 Unicode 编码值需要补零
        }
      }
      this.remark = unicode
    },
    remarkChange2(val) {
      let unicode = ''
      for (let i = 0; i < val.length; i++) {
        const charCode = val[i].charCodeAt(0).toString(16) // 获取每个字符的 Unicode 编码值
        if (charCode.length >= 4) {
          unicode += '\\u' + charCode // 对于超过四位的 Unicode 编码值需要添加 \u 前缀
        } else {
          unicode += '\\u00' + charCode // 对于不足四位的 Unicode 编码值需要补零
        }
      }
      return unicode
    },
    typeChange(val) {
      if (!this.model.op) {
        this.$message.warning('请先选择工站！')
        return
      }
      this.getRwkList(val.target.value)
    },
    getRwkList(typ) {
      let param = {
        line: this.model.line,
        op: this.op,
        pageNo: 1,
        pageSize: 100
      }
      if (typ) {
        param.type = typ
      }
      if (typ === '7') {
        this.$set(this.model, 'code', '')
        return
      }
      if (typ === '8') {
        this.$set(this.model, 'code', this.op + '->OK')
        return
      }
      if (typ === '9') {
        this.$set(this.model, 'code', this.op + '->NG')
        return
      }
      getAction(this.url.rwkList, param).then((res) => {
        this.rwkOptions = res.result.records
        if (this.rwkOptions.length === 1) {
          this.$set(this.model, 'code', this.rwkOptions[0].code)
        }
      })
    },
    handleChange(value) {
      if (value) {
        this.$set(this.model, 'cfgid', value)
      } else {
        this.$set(this.model, 'cfgid', '')
      }
      this.$set(this.model, 'cc', '')
      this.$set(this.model, 'code', '')
      let t1 = ''
      this.cfgOptionDetails.map(item => {
        if (item.recId === value) {
          console.log('匹配到')
          console.log(item)
          t1 = item.type
        }
      })
      if (t1) {
        this.$set(this.model, 'cc', t1)
        this.getRwkList(t1)
      }
    },
    filterOption(input, option) {
      return option.componentOptions.children[0].text.indexOf(input) !== -1
    },
    opChange(val) {
      //清空下边所有选项
      this.$set(this.model, 'cfgid', '')
      this.$set(this.model, 'cc', '')
      this.$set(this.model, 'code', '')
      this.op = val
      //访问对应产线对应工站的所有故障描述并展示
      let param = {
        line: this.model.line,
        op: this.op,
        pageNo: 1,
        pageSize: 100
      }
      getAction(this.url.cfgList, param).then((res) => {
        //将数据存放在数组中
        let option = []
        res.result.records.map(item => {
          option.push({
            value: item.recId,
            label: item.description
          })
        })
        this.cfgOptions = option
        this.cfgOptionDetails = res.result.records
      })
      //请求对应返工代码
      this.getRwkList('')
    },
    open(record) {
      this.codeModel = Object.assign({}, record)
      this.model.line = this.codeModel.line
      this.getOptions(this.model.line);
      this.$set(this.model, 'op', this.codeModel.op)
      this.unitsn = this.codeModel.unitsn
      this.remark = ''
      this.visible = true
      // this.edit(this.modelDefault)
    },
    close() {
      this.$emit('close')
      this.visible = false
      this.model = {}
      this.$refs.form.clearValidate()
    },
    onlyRecord() {
      const that = this
      let httpurl = this.url.addValue
      let param = {
        line: that.model.line,
        woid: that.codeModel.woid,
        unitsn: that.unitsn,
        cfgid: that.model.cfgid,
        type: '7',
        remark: that.model.remark
      }
      httpAction(httpurl, param, 'post').then((res) => {
        if (res.success) {
          that.$message.success(res.message)
          that.$emit('ok')
        } else {
          that.$message.warning(res.message)
        }
      }).finally(() => {
        that.confirmLoading = false
        that.close()
      })
    },
    handleOk() {
      const that = this
      //判断状态请求编码
      let cmd = ''
      if (this.model.cc === '1' || this.model.cc === '3') {
        cmd = 'rework'
      } else if (this.model.cc === '4') {
        cmd = 'OnHold'
      }else if (this.model.cc === '7') {
        cmd = 'Inspectrecord'
      }else {
        cmd = 'Chgsts'
      }
      let shift = ''
      if (this.model.shift) {
        shift = this.remarkChange2(this.model.shift)
      }
      this.load = {
        serviceid: 'mes',
        cmd: cmd,
        entityid: that.unitsn,
        clientid: that.model.line,
        user: Vue.ls.get(USER_INFO).username,
        Single: '1',
        remark: that.remark,
        code: that.model.code
      }
      if(that.model.cfgid){
        this.load.dc=that.model.cfgid
      }
      that.confirmLoading = true
      httpAction(this.runCmd, this.load, 'post').then((res) => {
        if (res.success) {
          if (res.result.errorCode === 'OK') {
            that.$message.success('操作成功！')
          }
        } else {
          that.$message.warn(res.message)
        }
      }).finally(() => {
        that.confirmLoading = false
        that.close()

      })
    },
    handleCancel() {
      this.close()
    }

  }
}
</script>
